// vue-4.x：
import { createRouter, createWebHistory } from 'vue-router';



// 配置路由规则
const routes = [
    {
        path: "/router-base",
        name: "router-base",
        component: () => import("../components/03nest-router/router-base"),
        children: [
            {
                path: "a",
                alias: "/suba",
                name: "router-base-a",
                component: () => import("../components/03nest-router/router-suba"),
                props: route => route.query
            },
            {
                path: "b",
                alias: "/subb",
                name: "router-base-b",
                component: () => import("../components/03nest-router/router-subb"),
                props: route => route.query
            }
        ]
    },
    {
        path: "/my-center/:user_name/:age",
        name: "my-center",
        component: () => import("../components/03nest-router/my-center"),
        props: route => route.params,
        children: [
            {
                path: "",
                name: "my-center-default",
                component: () => import("../components/03nest-router/my-default"),
            },
            {
                path: "fond/:name/:time",
                // 采用别名时，如果有params传参，也需要进行定义，此时父组件有params传参，只能默默地接受父组件拿不到参数
                alias: "/fond/:name/:time",
                name: "my-center-fond",
                component: () => import("../components/03nest-router/my-fond"),
                props: route => route.params
            },
            {
                path: "school/:name/:major",
                name: "my-center-major",
                component: () => import("../components/03nest-router/my-school"),
                props: route => route.params
            }
        ]
    },
    {
        path: "/named-router-view",
        name: "named-router-view",
        component: () => import("../components/04named-router-view/router-base"),
        children: [
            {
                path: "",
                name: "named-router-view-sub",
                components: {
                    default: import("../components/04named-router-view/router-default"),
                    'view-a': import("../components/04named-router-view/router-suba"),
                    'view-b': import("../components/04named-router-view/router-subb"),
                }
            }
        ]
    },
    {
        path: "/keep-alive",
        name: "keep-alive",
        component: () => import("../components/05keep-alive/test-component")
    },
    {
        path: "/not-found",
        name: "not-found",
        component: () => import("../components/06redirect/not-found")
    },
    // 上面规则如果都没有匹配上，采用下面的模糊匹配：重定向到404页面
    {
        path: '/:pathMatch(.*)*',
        redirect: '/not-found'
    }
]

// 创建路由对象
const router = createRouter({
    history: createWebHistory(process.env.BASE_URL),
    routes
})

// 导出路由对象
export default router;